<script setup>
import {ref,reactive} from "vue"
let count = ref(0);

console.log(count.value);

let arr = ref([1,2,4]);
arr.value[1]=200;
console.log(arr.value[1]);

let count1 = reactive({
    int : 660
})
console.log(count1);

let object=reactive({
    id:1,
    name:"张飞"
})

console.log(object.id,object.name);

let objarr=reactive([{person:1},{person:2}])

console.log(objarr);

let originInt = ref(100);
</script>

<template>
    <div>
    <h1>{{count}}</h1>
    <span>{{ arr }}</span>
    <p>{{ count1 }}</p>
    <h3>{{ object }}</h3>
    <button @click="object.name = '刘备' ">点一下就变  {{ object.name }}</button>\
    <h6>{{ objarr[1].person }}</h6>
    <button @click="originInt++">点一下给你加分</button>
    {{ originInt }}
    <button @click="originInt--">点一下给你减分</button>
</div>
</template>

<style scoped>

</style>
